<template>
	<view class="pages">
		<cu-custom bgColor="uerHead1" :isBack="true" textRight="true" type="1" @clickRight="clickRecord()">
			<block slot="backText" class="titilestyle">{{title}}</block>

		</cu-custom>

		<scroll-view scroll-y="true" :style="{height:swiperHeight+'px'}">
			<view class="inro-card  flex  flex-direction margin-top ">
				<!-- <view class="flex inro-card-fill  flex-wrap solid-bottom" @click="upAvator">
					<view class="basis-xll margin-xs  text-cut text-gray  flex align-center justify-between">
						<text>上传头像</text>
						<view>
							<view class="cu-avatar radius margin-left bg-blue">
								<text class="cuIcon-profile"></text>
							</view>
							<text class="cuIcon-right margin-left text-black"></text>
						</view>
					</view>
				</view> -->

				<view class="flex inro-card-fill  flex-wrap solid-bottom">
					<view class="basis-xll margin-xs  text-cut text-gray">
						*姓名
					</view>

					<view class="basis-xll margin-xs ">
						<input class=" " placeholder="输入您的姓名" value="" v-model="postData.name" name="input"></input>
					</view>
				</view>

				<view class="flex inro-card-fill  flex-wrap solid-bottom">
					<view class="basis-xll margin-xs  text-cut text-gray">
						*性别
					</view>

					<view class="basis-xll margin-xs text-xl">
						<picker mode="selector" :range="sex" @change="selectSex">
							<view class="flex justify-between align-center">
								<view class="">
									<text class=""
										:class="postData.gender!=-1?'text-black':'text-gray'">{{postData.gender!=-1?sex[postData.gender]:"请选择您的性别"}}</text>
								</view>
								<view>
									<text class="cuIcon-right"></text>
								</view>
							</view>
						</picker>
					</view>
				</view>

				<view class="flex inro-card-fill  flex-wrap solid-bottom">
					<view class="basis-xll margin-xs  text-cut text-gray">
						出生日期
					</view>

					<view class="basis-xll margin-xs text-xl  ">
						<picker mode="date" :value="postData.birthday" @change="selectBirthday">

							<view class=" flex  justify-between align-center">
								<view class="">
									<text class=""
										:class="postData.birthday!=''?'text-black':'text-gray'">{{postData.birthday!=""?postData.birthday:"请选择您的生日"}}</text>
								</view>
								<view class="">
									<text class="cuIcon-right"></text>
								</view>
							</view>

						</picker>


					</view>
				</view>

				<view class="flex inro-card-fill  flex-wrap solid-bottom">
					<view class="basis-xll margin-xs  text-cut text-gray">
						*手机号
					</view>

					<view class="basis-xll margin-xs text-xl  ">
						<view class=" flex  justify-between align-center">
							<view class="">
								<input class=" " type="number" placeholder="输入您的电话号码" v-model="postData.phone"
									name="input"></input>
							</view>
							<!-- <view class="">
								<button open-type="getPhoneNumber" @getphonenumber="onGetPhoneNumber"
									class="cu-btn bg-blue">使用微信电话</button>
							</view> -->
						</view>

					</view>
				</view>

				<view class="flex inro-card-fill  flex-wrap solid-bottom">
					<view class="basis-xll margin-xs  text-cut text-gray">
						*期望省份
					</view>

					<view class="basis-xll margin-xs text-xl  ">
						<picker mode="region" @change="selectPostion">

							<view class=" flex  justify-between align-center">
								<view class="">
									<text class=" text-cut" :class="postData.province!=''?'text-black':'text-gray'">
										{{postData.province==""?"请选择省份":postData.province}}{{postData.city!=""?"-"+postData.city:""}}{{postData.district!=""?"-"+postData.district:""}}

									</text>
								</view>
								<view class="">
									<text class="cuIcon-right"></text>
								</view>
							</view>

						</picker>

					</view>
				</view>

				<view class="flex inro-card-fill  flex-wrap ">
					<view class="basis-xll margin-xs  text-cut text-gray">
						*期望薪资
					</view>

					<view class="basis-xll margin-xs text-xl  ">
						<picker mode="multiSelector" @change="confrimPrice" @columnchange="selectPrice"
							:value="multiIndex" :range="price">

							<view class=" flex  justify-between align-center">
								<view class="">
									<text class=" text-cut" :class="postData.min_price!=''?'text-black':'text-gray'">
										{{postData.min_price==-1?"请选择期望薪资":postData.min_price/1000+"k"}}{{postData.max_price==-1?"":"-"+postData.max_price/1000+'K'}}
									</text>
								</view>
								<view class="">
									<text class="cuIcon-right"></text>
								</view>
							</view>
						</picker>
					</view>
				</view>
				
				
				<view class="flex inro-card-fill  flex-wrap solid-bottom">
					<view class="basis-xll margin-xs  text-cut text-gray">
						*期望职位
					</view>

					<view class="basis-xll margin-xs ">
						<input class=""  adjust-position="false" placeholder="输入您期望的职位" value="" v-model="postData.job" name="input"></input>
					</view>
				</view>

			</view>

			<view class="padding flex basis-xl flex-wrap middle " @click="save()">
				<button class="cu-btn lg bg-blue" style="width: 100%;">保存</button>
			</view>


		</scroll-view>




	</view>
</template>

<script>
	export default {

		data() {

			return {
				title: "基础信息",
				swiperHeight: 0,
				sex: ['男', '女'],
				price: [
					[],
					[]
				],
				multiIndex: [0, 0],
				postData: {
					name: "",
					gender: -1,
					birthday: "",
					phone: "",
					province: "",
					city: "",
					district: '',
					min_price: "",
					max_price: "",
					job: ""
				}

			}
		},
		onReady() {
			this.getInfo().then((e) => {
				this.swiperHeight = e.screenHeight - (e.custom.top + e.custom.height);
			});
			let k = 0;
			for (let i = 0; i <= 250; i++) {
				if (k < 30) {
					k += 1;
				} else if (k < 100 && k >= 30) {
					k += 5;

				} else if (k < 250 && k >= 100) {
					k += 10;
				} else {
					break;
				}
				this.price[0].push(k + "k");
			}
			this.getReseume();
		},
		methods: {
			/**
			 * 获取我的简历
			 */
			getReseume() {
				this.apiRequest('/buyer/OfferResume', {

				}, "get", 0).then(res => {
					if (res.code == 200) {
						for (let i in this.postData) {

							if (i == "birthday") {
								let a = (res.data.resume[i]).split(" ");
								res.data.resume[i] = a[0];
								

							}
							this.postData[i] = res.data.resume[i];

						}
						this.init();

					}


				})



			},
			/**
			 * 初始值
			 */
			init() {
				let minPrice = (this.postData.min_price / 1000) + "k";
				let maxPrice=(this.postData.max_price/1000)+"k";
				let isSet = this.price[0].indexOf(minPrice);
				if(isSet>-1){
					this.multiIndex[0]=isSet;
					let value = parseInt(this.postData.min_price/1000);
					let priceArr = [];
					(this.postData.min_price != "面议") ? (() => {
						for (let i = 0; i < 8; i++) {
							value = parseInt(value) + 1;
							priceArr.push(value + "k");
						}
					})() : (() => {
						priceArr.push("面议");
					})();
					this.$set(this.price, 1, priceArr);
					let isSetMax = this.price[1].indexOf(maxPrice);
					(isSetMax>-1)?(()=>{
						this.multiIndex[1]=isSetMax;
					})():"";
				}
				
                
				console.log("is set  "+isSet+" val "+minPrice);

			},
			/**
			 * 消失提示
			 * @param {Object} content
			 */
			showToast(content) {
				uni.hideLoading();
				uni.showToast({
					title: content,
					icon: "none"
				});

			},
			/**
			 * 选择性别
			 */
			selectSex(e) {
				this.postData.gender = e.detail.value;
			},
			/**
			 * 选择生日
			 */
			selectBirthday(e) {
				this.postData.birthday = ((e.detail.value).split(" "))[0];
			},

			/**
			 * 选择学历
			 * @param {Object} e
			 */
			selectPostion(e) {
				this.postData.province = e.detail.value[0];
				this.postData.city = e.detail.value[1];
				this.postData.district = e.detail.value[2];
			},
			/**
			 * @param {Object} 确认薪资
			 */
			confrimPrice(e) {
				let min = this.price[0][e.detail.value[0]],
					max = this.price[1][e.detail.value[1]];
				this.postData.min_price = min.split("k")[0] * 1000;
				this.postData.max_price = max.split("k")[0] * 1000;
			},
			/**
			 * 选择薪资
			 * @param {Object} e
			 */
			selectPrice(e) {
				switch (e.detail.column) {
					case 0:
						let val = (this.price[0][e.detail.value]).split("k");
						let value = val[0];
						let priceArr = [];
						(val != "面议") ? (() => {
							for (let i = 0; i < 8; i++) {
								value = parseInt(value) + 1;
								priceArr.push(value + "k");
							}
						})() : (() => {
							priceArr.push("面议");
						})();
						this.$set(this.price, 1, priceArr);
						break;
					case 1:
						break;
				}
			},

			/**
			 * 上传头像
			 */
			upAvator() {
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album'], //从相册选择
					success: (res) => {

						console.log(JSON.stringify(res.tempFilePaths));
					}
				});


			},
			/**
			 * 验证表达式
			 */
			verify(...dat) {
				let val = true,
					da = dat[1][dat[0]];
				console.log(da);
				switch (dat[0]) {
					case "name": //关于username的验证
						if (da.length == 0) {
							this.showToast("请输入姓名");
							val = false;
						}
						break;
					case "gender":
						if (da == -1) {
							console.log(da)
							this.showToast("请选择性别");
							val = false
						}
						break;

					case "phone":
						if (!RegExp(/^1[3456789]\d{9}$/).test(da)) {
							this.showToast("手机号格式错误");
							val = false
						}
						break;
					case "province":
						if (da == "") {
							this.showToast("请选期望的省份");
							val = false
						}
						break;
					case "min_price":

						if (da == "") {

							this.showToast("请选期望的薪资");
							val = false
						}
						break;
					case "job":

						if (da == "") {

							this.showToast("请填写期望的职位");
							val = false
						}
						break;
				}
				return val
			},

			/**
			 * 保存简历
			 */
			save() {
				let dat = this.postData;
				for (let u in dat) {
					let isPass = this.verify(u, dat);
					if (!isPass) {
						return false;
					}
				}

				let postInfo = {};
				postInfo.basic = this.postData;
				uni.setStorageSync("postInfo", postInfo);

				this.apiRequest('/buyer/OfferResumeEdit', this.postData, 1, "post").then(res => {

					if (res.code == 200) {
						uni.showToast({
							title: "保存成功",
							icon: "success"
						})
						this.postInfo = res.data.resume;

					}
				}).catch(() => {

				})





			}



		}



	}
</script>

<style scoped>
	.pages{
		overflow-y: hidden;
	}
	/**
	 * 卡片样式
	 */
	.inro-card {
		width: 92%;
		margin: 20upx auto;
		background: #FFFFFF;
		box-shadow: 0px 0px 10upx 0px rgba(0, 0, 0, 0.05);
		border-radius: 20upx;
		padding: 30upx;
		position: relative;
	}

	.inro-card-fill {
		width: 100%;
		padding: 20rpx 0 20rpx 0;
		min-height: 100rpx;
	}

	.text-right {
		position: absolute;
		float: right;
		right: 0;
	}

	/* 	picker {
		position: relative;
	} */
</style>
